<template>
    <div class="course-edit">
        <el-button icon="el-icon-back" type="primary" size="mini" @click="goBack">返回</el-button>
        <div class="topbar text-center mt20 mb30">
            课程内容编辑
        </div>
        <editor v-model="html"></editor>
        <div class="text-center pt20">
            <el-button icon="el-icon-back" size="default" @click="goBack">上一步</el-button>
            <el-button type="primary" size="default" @click="onSubmit">保存</el-button>
            <el-button type="primary" size="default" @click="nextStep">保存并编辑教案</el-button>
        </div>
    </div>
</template>

<script>
    import TinymceEditor from '@/components/Tinymce'
    import { insertLesson, updateLesson } from '@/api'
    export default {
        components: {
            'editor': TinymceEditor
        },
        data() {
            let baseInfo = window.sessionStorage.getItem('courseBaseInfo')
            return {
                courseId: this.$route.params.id,
                html: '',
                form: baseInfo ? JSON.parse(baseInfo) : ''
            };
        },
        watch:{
            'html':function(v){
                this.form.content = v
            }
        },
        created(){
            let editHistory = window.sessionStorage.courseDetailInfo
            if(editHistory) {
                this.html = editHistory
                return false
            }
            if(this.courseId){
                this.html = this.form.content
            }
        },
        mounted(){
            
            
        },
        methods: {
            goBack() {
                this.$router.go(-1)
            },
            onSubmit() {
                if(this.html.trim()==''){
                    this.$message.error('请填写课程内容')
                    return false
                }
                let saveUrl = this.courseId ? updateLesson : insertLesson
                saveUrl(this.form).then( res => {
                    this.$message.success('保存成功')
                    setTimeout(function(){
                        this.$router.push('/course')
                    }.bind(this), 2000);
                })
            },
            nextStep(){
                if(this.html.trim()==''){
                    this.$message.error('请填写课程内容')
                    return false
                }
                let saveUrl = this.courseId ? updateLesson : insertLesson
                saveUrl(this.form).then( res => {
                    this.$message.success('保存成功')
                    setTimeout(function(){
                        window.sessionStorage.setItem('courseDetailInfo', this.html.trim())
                        window.sessionStorage.setItem('courseIntro', this.form.groupContent || '')
                        this.$router.push('/course/edit/intro/'+(this.courseId ? this.courseId : res.data.result))
                    }.bind(this), 2000);
                })
            }
        }
    };
</script>
 <style lang="scss" scoped>
    .course-edit /deep/ {
        .topbar {
            background: #f2f2f2;
            line-height: 30px;
        }
    }
 </style>
 